{% extends "base/base.html" %}

{% comment %}

 Copyright 2013 - Tom Alessi

 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
 You may obtain a copy of the License at

     http://www.apache.org/licenses/LICENSE-2.0

 Unless required by applicable law or agreed to in writing, software
 distributed under the License is distributed on an "AS IS" BASIS,
 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 See the License for the specific language governing permissions and 
 limitations under the License.

{% endcomment %}

{% block content %}
		
<form method="POST" action="/admin/escalation_config">
{% csrf_token %}

<div class="row">
	{# This is a large-3 side nav #}
	{% include "admin/side_nav.html" %}

	<div class="large-9 columns">

	  <div class="row">
	    <div class="large-12 columns">
	      <h1>Escalation Configuration</h1>
	      <p>If you would like to display an escalation path and associated links to escalation contacts, please complete the relevant fields below.</p>
	      <hr>
	    </div>
	  </div>

    {# This is row consisting of 12 columns that will display all messages passed in the request #}
    {% include "admin/messages.html" %}

	  <div class="row">
	    <div class="large-12 columns">
        <span class="radius secondary label">Enable Escalation Path</span><br>
        <div class="sublabel_container"><span class="sublabel">Select the checkbox to enable the escalation path link and associated page.</span></div>
	    </div>
	  </div>

	  <div class="row">
	    <div class="large-12 columns">
				<label><input type="checkbox" name="enabled" {% if form.enabled.data %}checked{% else %}{% if escalation_config.0.enabled == 1 %}checked{% endif %}{% endif %} />&nbsp;Enabled</label>
	   		{% if form.enabled.errors %}
				<span class="err">{% for error in form.enabled.errors %}{{error}}<br>{% endfor %}<br></span>
		    {% endif %} 
			</div>
		</div>

		<div class="spacer_medium"></div>

	    <div class="row">
	      <div class="large-12 columns">
	        <span class="radius secondary label">Escalation Instructions</span>
	        &nbsp;<b><span id="instructions_counter" class="counter"></span></b>
	        <div class="sublabel_container"><span class="sublabel">Enter escalation instructions, that will be displayed above the escalation path.</span></div>
	      </div>
	    </div>

	    <div class="row">
	      <div class="large-12 columns {% if form.instructions.errors %}error{% endif %}">
	        <textarea id="instructions" name="instructions" placeholder="Enter escalation instructions" maxlength="1000">{% if form.instructions.data %}{{form.instructions.data}}{% else %}{{escalation_config.0.instructions}}{% endif %}</textarea>
	        {% if form.instructions.errors %}
	        <br><span class="err">{% for error in form.instructions.errors %}{{error}}<br>{% endfor %}<br></span>
	        {% endif %}
	      </div>
	    </div>

		<div class="spacer_small"></div>

		<div class="row">
		  <div class="large-11 columns">
		    <input type="submit" class="small button secondary" value="Save"/>
		  </div>
		</div>

	</div>
</div>

</form>


<script>
  // Textarea counters
  $("#instructions").keyup(function(){
    $("#instructions_counter").text("Characters remaining: " + (1000 - $(this).val().length));
  });
</script>

{% endblock %}



